@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.home {
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background: #ffffff;
}
.home .home-nav .down-wrapper {
  padding-left: 25rpx;
  display: flex;
  align-items: center;
}
.home .home-nav .down-wrapper .name-cu {
  color: #ffffff;
  font-size: 34rpx;
}
.home .home-nav .down-wrapper .down-img {
  width: 20rpx;
  height: 12rpx;
  margin-left: 10rpx;
}
.home .home-wrapper {
  flex: 1;
  position: relative;
}
.home .home-wrapper .top-wrapper {
  width: 750rpx;
  height: 57.796vh;
  position: relative;
}
.home .home-wrapper .top-wrapper .l-bg {
  position: absolute;
  top: 35rpx;
  left: 0;
  width: 130rpx;
}
.home .home-wrapper .top-wrapper .r-bg {
  position: absolute;
  top: 44rpx;
  right: 0;
  width: 139rpx;
}
.home .home-wrapper .top-wrapper .lock {
  padding-top: 5.247vh;
}
.home .home-wrapper .top-wrapper .lock .lock-wrapper {
  position: relative;
  height: 28.861vh;
  width: 28.861vh;
  margin: 0 auto;
}
.home .home-wrapper .top-wrapper .lock .lock-wrapper .lock-close {
  width: 28.861vh;
  position: absolute;
  height: 28.861vh;
  animation: rotate 5s linear infinite;
}
.home .home-wrapper .top-wrapper .lock .lock-wrapper .cen-img {
  width: 357rpx;
  height: 26.762vh;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
}
.home .home-wrapper .top-wrapper .button {
  width: 456rpx;
  height: 7.496vh;
  background-color: #ffffff;
  border-radius: 3.748vh;
  font-size: 30rpx;
  letter-spacing: 1rpx;
  color: #0167e2;
  line-height: 7.496vh;
  text-align: center;
  margin: 0 auto;
  margin-top: 4.498vh;
}
.home .home-wrapper .top-wrapper .world {
  font-size: 20rpx;
  color: #ffffff;
  text-align: center;
}
.home .home-wrapper .list-wrapper {
  position: absolute;
  display: flex;
  font-size: 24rpx;
  color: #272727;
  flex-wrap: wrap;
  bottom: 14.543vh;
  box-shadow: rgba(0, 0, 0, 0.1) -8px 0px 8px -8px, rgba(0, 0, 0, 0.1) 8px 0 8px -8px;
  width: 700rpx;
  left: 25rpx;
  background: #ffffff;
  padding-top: 3.973vh;
  border-radius: 40rpx 40rpx 0 0;
}
.home .home-wrapper .list-wrapper .item {
  text-align: center;
  width: 25%;
}
.home .home-wrapper .list-wrapper .item .text {
  line-height: 1;
}
.home .home-wrapper .list-wrapper .item:nth-child(-n+4) {
  margin-bottom: 4.873vh;
}
.home .home-wrapper .list-wrapper .item:nth-child(-n+4) .img {
  width: 6.747vh;
  height: 6.747vh;
  margin-bottom: 2.024vh;
}
.home .home-wrapper .list-wrapper .item:nth-child(5) .img {
  width: 3.448vh;
  height: 3.148vh;
  margin-bottom: 2.024vh;
}
.home .home-wrapper .list-wrapper .item:nth-child(6) .img {
  width: 2.624vh;
  height: 3.148vh;
  margin-bottom: 2.024vh;
}
.home .home-wrapper .list-wrapper .item:nth-child(7) .img {
  width: 3.298vh;
  height: 3.073vh;
  margin-bottom: 2.024vh;
}
.home .home-wrapper .list-wrapper .item:nth-child(8) .img {
  width: 3.073vh;
  height: 3.073vh;
  margin-bottom: 2.024vh;
}
.home .cur {
  display: block !important;
  opacity: 1 !important;
}
.home .selected-community {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  display: none;
  background: rgba(0, 0, 0, 0.6);
  z-index: 10000;
  transition: all 2s linear;
  opacity: 0;
}
.home .content-wrapper {
  position: fixed;
  top: 11.094vh;
  z-index: 100001;
  width: 710rpx;
  left: 20rpx;
  display: none;
  background-color: #ffffff;
  box-shadow: 0rpx 0rpx 6rpx 0rpx rgba(36, 31, 27, 0.08);
  border-radius: 14rpx;
  padding: 26rpx 34rpx 29rpx 34rpx;
}
.home .content-wrapper .top-title {
  font-size: 24rpx;
  color: #000000;
  font-weight: 500;
}
.home .content-wrapper .list-community {
  margin-top: 25rpx;
}
.home .content-wrapper .list-community .community-item {
  padding: 10rpx 20rpx;
  background-color: #efefef;
  border-radius: 4px;
  font-size: 20rpx;
  color: #656565;
  display: inline-block;
  vertical-align: middle;
  margin-bottom: 20rpx;
  margin-right: 20rpx;
}
.home .attention {
  color: red;
  position: fixed;
  bottom: 100rpx;
  z-index: 1000;
  width: 100%;
}
.home .attention .image {
  position: absolute;
  right: 0;
  z-index: 1001;
  width: 50rpx;
  height: 50rpx;
  border: 1px solid red;
}
.visitor .bg-visitor {
  width: 750rpx;
  height: 490rpx;
}
.visitor .banner-item {
  position: absolute;
  top: 411rpx;
  width: 700rpx;
  height: 161rpx;
  background-color: #ffffff;
  box-shadow: 0rpx 0rpx 9rpx 0rpx rgba(1, 114, 231, 0.34);
  border-radius: 16rpx;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  padding: 35rpx 0;
}
.visitor .banner-item .border {
  border-right: 1px solid #dbdbdb;
}
.visitor .banner-item .item {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.visitor .banner-item .item .item-img-wrapper {
  width: 90rpx;
  height: 90rpx;
  margin-right: 18rpx;
  position: relative;
}
.visitor .banner-item .item .item-img-wrapper .item-img {
  width: 100%;
  height: 100%;
}
.visitor .banner-item .item .item-img-wrapper .circle {
  position: absolute;
  right: 0;
  top: 0;
  background-color: #f54f4f;
  height: 14px;
  width: 14px;
  font-size: 20rpx;
  color: #ffffff;
  font-weight: 500;
  text-align: center;
  line-height: 14px;
  border-radius: 50%;
}
.visitor .banner-item .item .text-r {
  font-size: 26rpx;
  color: #010101;
  font-weight: 500;
}
.visitor .wait {
  font-size: 28rpx;
  font-weight: 700;
  padding: 121rpx 25rpx 39rpx 25rpx;
}
.visitor .list-wrapper {
  width: 100%;
  height: 100%;
}
.visitor .list-wrapper .list-item-inner {
  padding: 0  25rpx;
}
.visitor .list-wrapper .list-item-inner:first-child {
  padding-top: 25rpx;
}
.visitor .list-wrapper .list-item-inner .list-item {
  background-color: #ffffff;
  box-shadow: 0rpx 2rpx 8.5rpx 0.5rpx rgba(188, 188, 192, 0.18);
  border-radius: 24rpx;
  padding: 38rpx 32rpx 59rpx 30rpx;
  margin-bottom: 25rpx;
  position: relative;
}
.visitor .list-wrapper .list-item-inner .list-item .i-l .t-name {
  font-size: 20rpx;
  color: #cfcfcf;
  margin-bottom: 14rpx;
}
.visitor .list-wrapper .list-item-inner .list-item .i-l .w-world {
  font-size: 28rpx;
  color: #000000;
  font-weight: 700;
}
.visitor .list-wrapper .list-item-inner .list-item .i-l .t-world {
  margin-bottom: 20rpx;
}
.visitor .list-wrapper .list-item-inner .list-item .i-r {
  position: absolute;
  right: 32rpx;
  top: 50%;
  transform: translateY(-50%);
  width: 150rpx;
  height: 150rpx;
}
.visitor .list-wrapper .list-item-inner .list-item .i-r-btn {
  padding: 14rpx 36rpx;
  background-color: #e8f2ff;
  border-radius: 25rpx;
  font-size: 24rpx;
  color: #0768e2;
  position: absolute;
  right: 32rpx;
  top: 50%;
  transform: translateY(-50%);
}
.visitor .list-wrapper .list-item-inner .list-item .btn-ing {
  background-color: #fff8e8;
  color: #f0b62b;
}
.visitor .list-wrapper .list-item-inner .list-item .btn-overdue {
  background-color: #f4f4f4;
  color: #c1c1c1;
}
